<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:ui="http://java.sun.com/jsf/facelets">

	<h2>Créer un rêve</h2>
	<h:form>
		<div class="row">
			<div class="small-12 medium-6 columns">
				<div class="row">
					<div class="small-12 columns">
						<label>Titre</label> <input type="text" placeholder="Titre" />
					</div>
				</div>
				<div class="row collapse">
					<label>Durée</label>
					<div class="small-8 columns">
						<input type="text" placeholder="Durée" />
					</div>
					<div class="small-4 columns">
						<span class="postfix">minutes</span>
					</div>
				</div>
				<div class="row collapse">
					<label>Nombre de personnes</label>
					<div class="small-8 columns">
						<input type="text" placeholder="Nombre de personnes" />
					</div>
					<div class="small-4 columns">
						<span class="postfix">personnes</span>
					</div>
				</div>

				<div class="row collapse">
					<label>Réalisme</label>
					<div class="small-8 columns">
						<input type="text" placeholder="Réalisme" />
					</div>
					<div class="small-4 columns">
						<span class="postfix">%</span>
					</div>
				</div>
				<div class="row collapse">
					<label>Prix</label>
					<div class="small-8 columns">
						<input type="text" placeholder="Prix" />
					</div>
					<div class="small-4 columns">
						<span class="postfix">€</span>
					</div>
				</div>
				<div class="row collapse">
					<label>Stock de départ</label>
					<div class="small-8 columns">
						<input type="text" placeholder="Stock de départ" />
					</div>
					<div class="small-4 columns">
						<span class="postfix">unités</span>
					</div>
				</div>
			</div>
			<div class="small-12 medium-6 columns">
				<div class="row">
					<div class="small-12 columns">
						<h5>Catégories</h5>
						<br />
					</div>
				</div>
				<div class="row">
					<div class="small-8 columns">
						<label class="display">Jokari</label>
					</div>
					<div class="small-1 columns">
						<i class="foundicon-minus"></i>
					</div>
				</div>
				<div class="row">
					<div class="small-10 columns">
						<select>
							<option value="1">Rêves de gloire</option>
							<option value="2">Voyages</option>
							<option value="3">Sport</option>
							<option value="4">Football</option>
							<option value="5">Jokari</option>
							<option value="6">Science-fiction</option>
							<option value="7">Historiques</option>
							<option value="8">Paix dans le monde</option>
							<option value="9">Coquins</option>
						</select>
					</div>
					<div class="small-1 small-center columns casse-small">
						<i class="foundicon-plus"></i>
					</div>
				</div>
				<div class="row">
					<label>Rêve prémonitoire</label>
					<div class="small-12 columns">
						<input id="checkboxPremonitoire" type="checkbox"></input><label
							for="checkboxPremonitoire" class="display">prémonitoire</label>
					</div>
				</div>
			</div>
		</div>
		<div class="row">
			<div class="small-12 columns">
				<a href="#" class="button radius large success">Enregistrer</a>
			</div>
		</div>

	</h:form>

</ui:composition>